<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>烘焙馆-资讯专题页</title>
    <!-- import CSS -->
    <link rel="stylesheet" href="https://cdn.staticfile.org/element-ui/2.15.9/theme-chalk/index.css">
    <style>
        html {
            overflow: scroll;
            scroll-behavior: smooth
        }

        body {
            margin: 0;
            padding-top: 100px;
        }
        #rightC1Drawer {
            max-height: 250px;
            transition: max-height .5s;
        }

        #rightC1Drawer:hover {
            max-height: 500px;
        }

        .el-card {
            margin-bottom: 15px;
        }

        .el-timeline {
            padding: 0;
        }

        #rightCRankDrawer {
            max-height: 100px;
            transition: max-height .2s;
        }

        #rightCRankDrawer:hover {
            max-height: 200px;
        }


        .el-card{
            border-radius: 30px;
        }
        .hoverable {
            transition-duration: .1s;
        }

        .hoverable:hover {
            transform: scale(1.1);
            transition-duration: .2s;
            filter: brightness(1.05);
        }

        .hoverable:active {
            transform: scale(.8);
            transition-duration: .05s;
        }

        .el-button:focus, .el-button {
            color: black;
            background: transparent;

            border: none;
            border-radius: 15px;
        }

        .el-button:hover {
            color: orange;
            background: transparent;

            box-shadow: 0 5px 5px 0 rgba(0,0,0,0.1);
        }

        .el-button:active {
            color: orange;
            background: transparent;

            box-shadow: none;
        }

        .t {
            text-decoration: none;
            color: orange;
        }

        .block-row {
            margin: 25px 0 0 0;
        }

        #ft-top-div a {
            font-size: 14px;
            line-height: 20px;
            text-decoration: none;
            color: #676b6f;
            display: block;
            margin: 5px 0;
        }

        #ft-top-div h3 {
            color: white
        }

        #ft-mid-div a {
            font-size: 14px;
            line-height: 20px;
            text-decoration: none;
            margin: 0 5px;
            color: #424649;
        }
        #ft-top-div p {
            font-size: 16px;
            line-height: 30px;
            color: #676b6f;
            margin: 5px 0;
        }
        [v-clock]{display: none}
    </style>
</head>

<body >
<div id="app" v-clock>
    <el-header id="el-hd"
               style="height: fit-content;width: 100%;
                   padding: 15px 0;
                   position: fixed;top: 0;left: 0;z-index: 999;
                   background:white">
        <!--主导航栏开始-->
        <el-row id="hd-topBar-row" gutter="20" type="flex" justify="space-between"
                style="width: 1200px;height: 70px;margin: 0 auto">
            <!--图标开始-->
            <el-col span="4">
                <img src="../imgs/icon/icon01.png" alt="icon.png" style="height: 100%">
            </el-col>
            <!--图标结束-->

            <!--导航开始-->
            <el-col span="8">
                <el-menu :default-active="hdTopNavActiveIndex" class="el-menu-demo"
                         mode="horizontal"
                         @select="hdNavHandleSelect"
                         active-text-color="orange">
                    <el-menu-item :index="i+1" v-for="(item,i) in hdTopMenuArr">
                        <a :href="item.url" class="my-menu-a hoverable">
                            {{item.name}}</a>
                    </el-menu-item>
                </el-menu>
            </el-col>
            <!--导航结束-->

            <!--涉及领域开始-->
            <el-col span="4">
                <el-popover
                        placement="bottom"
                        width="160"
                        trigger="click"
                        style="z-index: 3;">
                    <div v-for="item in topTopFastNavArr">
                        <el-popover
                                placement="left"
                                width="670"
                                trigger="hover"
                                close-delay="50">
                            <h2 style="margin: 20px">快速导航</h2>
                            <el-row gutter="10">
                                <el-col span="6" v-for="nav in item.nav">
                                    <el-card class="hoverable"
                                             style="background:rgba(255,255,255,.7);border: none">
                                        <p style="font-size: 16px;font-weight: bold">{{nav.name}}</p>
                                        <p style="font-size: 12px">{{nav.info}}</p>
                                    </el-card>
                                </el-col>
                            </el-row>
                            <h2 style="margin: 20px">热门岗位</h2>
                            <el-row gutter="10">
                                <el-col span="4" v-for="j in item.job">
                                    <el-card class="hoverable"
                                             style="background:rgba(255,255,255,.7);border: none">
                                        <p style="font-size: 12px">{{j}}</p>
                                    </el-card>
                                </el-col>
                            </el-row>
                            <p class="hoverable" slot="reference"
                               style="font-size: 20px;font-weight: lighter;text-align: center;
                                       margin: 25px auto">
                                {{item.text}}
                            </p>
                        </el-popover>
                    </div>
                    <p class="hoverable t" slot="reference"
                       style="font-size: 20px;font-weight: lighter;text-align: center">
                        涉及领域
                    </p>
                </el-popover>
            </el-col>
            <!--涉及领域结束-->

            <!--搜索栏开始-->
            <el-col span="6">
                <el-input style="margin: 15px 0;"
                          placeholder="请输入要搜索的内容"
                          suffix-icon="el-icon-search"
                          v-model="search_text">
                </el-input>
            </el-col>
            <!--搜索栏结束-->

            <!--登录注册图标开始-->
            <el-col span="2">
                <el-popover placement="top" title="欢迎来到烘焙网!" width=50px trigger="hover">
                    <el-row>
                        <el-col span="12">
                            <el-button class="hoverable" type="info" @click="location.href='reg.html'">注册</el-button>
                        </el-col>
                        <el-col span="12">
                            <el-button class="hoverable" type="success" @click="location.href='login.html'">登录</el-button>
                        </el-col>
                    </el-row>

                    <div class="hoverable" slot="reference"
                         style="height:100%;width:100%;margin: 0 auto;font-size: 25px;line-height: 25px;display: table">
                        <i class="el-icon-user"
                           style="display: table-cell;text-align: center;vertical-align: middle"></i>
                    </div>
                </el-popover>
            </el-col>
            <!--登录注册图标结束-->
        </el-row>
        <!--主导航栏结束-->
    </el-header>
    <el-main style="background:#f2f5f7;width: 100%;height: 100%">
        <el-row gutter="30" style="width: 1200px;margin: 0 auto">
            <el-col span="18">
                <el-card style="height: 124px;border-radius: 30px">
                    <el-avatar :size="84" src="../imgs/other/04.png" style="display: inline-block"></el-avatar>
                    <div style="display:inline-block;position: relative;top:-50px;margin: 15px">
                        <span style="font-size: 20px;font-weight: bold;margin: 0 10px">行业资讯</span>
                        <span style="font-size: 15px;font-weight: lighter;color: gray;margin-right: 10px">今日:0 | 主题:3</span>
                        <a class="t" href="">收藏本版</a>
                    </div>
                    <el-button class="hoverable" style="float: right">
                        <p style="display:block;width: 75px;font-size: 20px;font-weight: lighter"><i
                                class="el-icon-position"></i>发帖</p>
                    </el-button>
                </el-card>
                <el-card>
                    <h1 style="font-weight: lighter">资讯</h1>
                    <el-divider></el-divider>
                    <el-row gutter="30" v-for="item in leftItemsArr">
                        <el-col span="7">
                            <img class="hoverable" :src="item.url" alt="img" width="100%">
                        </el-col>
                        <el-col span="17">
                            <h2>{{item.title}}</h2>
                            <p>{{item.detail}}</p>
                            <el-avatar size="small" src="../imgs/icon/icon02.png"></el-avatar>
                            <span>作者: {{item.author}}</span>
                            <el-divider direction="vertical"></el-divider>
                            <span>时间: {{item.date}}</span>
                            <el-divider direction="vertical"></el-divider>
                            <span>阅读: {{item.view}}</span>
                            <el-divider direction="vertical"></el-divider>
                            <span>回复: {{item.reply}}</span>
                        </el-col>
                        <el-col span="24">
                            <el-divider style="display: block"></el-divider>
                        </el-col>
                    </el-row>
                </el-card>
            </el-col>
            <el-col span="6">
                <!--关注迪恩网络-->
                <el-card id="rightC1Drawer" style="padding: 0;background: white url('../imgs/other/01.png') no-repeat;">
                    <div style="height: fit-content">
                        <div style="width: 100%;height: 100px"></div>
                        <el-row gutter="10" style="margin: 0 auto">
                            <el-col span="10"><img src="../imgs/other/02.png" alt="迪恩QR" width="84px"></el-col>
                            <el-col span="14">
                                <h4 style="margin: 10px 0;">关注迪恩网络</h4>
                                <h5 style="margin: 0;">扫描关注,了解最新资讯</h5></el-col>
                        </el-row>
                    </div>
                    <el-row gutter="10" style="margin: 0 auto">
                        <el-col span="12">
                            <el-button class="hoverable">新浪微博</el-button>
                        </el-col>
                        <el-col span="12">
                            <el-button class="hoverable">官方微信</el-button>
                        </el-col>
                    </el-row>
                    <div>
                        <el-divider></el-divider>
                        <h6>联系人：高经理</h6>
                        <h6>电话：15562103797</h6>
                        <h6>EMAIL：3318850993@qq.com</h6>
                        <h6>地址：威海市创新创业大厦2702</h6>
                    </div>
                </el-card>
                <!--相关资料-->
                <el-card>
                    <h2 style="font-weight: lighter">相关分类</h2>
                    <el-divider></el-divider>
                    <el-button class="hoverable">资讯</el-button>
                    <el-button class="hoverable">关于</el-button>
                    <br>
                    <el-button class="hoverable">食谱</el-button>
                    <el-button class="hoverable">排行榜</el-button>
                </el-card>
                <!--资讯幻灯片-->
                <el-card>
                    <h2 style="font-weight: lighter">资料幻灯片</h2>
                    <el-divider></el-divider>
                    <div class="hoverable" >
                        <el-carousel height="150px" indicator-position="outside">
                            <el-carousel-item v-for="item in rightCaroArr" :key="item">
                                <img :src="item.url" height="100%" width="100%">
                                <p class="small"
                                   style="position: absolute;left: 0;bottom: 0;
                               color: #e8e8e8;font-size: 90%;
                               display: block;margin: 0;padding: 14px;width: 100%;
                               background: linear-gradient(transparent 0%, black 100%)">
                                    {{ item.title }}</p>
                            </el-carousel-item>
                        </el-carousel>
                    </div>
                </el-card>

                <!--热门评论-->
                <el-card style="height: 500px;overflow-y: scroll">
                    <h2 style="font-weight: lighter">热门评论</h2>
                    <el-divider></el-divider>
                    <el-timeline>
                        <el-timeline-item v-for="item in rightReplyArr" :timestamp="item.time" placement="top">
                            <el-card class="hoverable">
                                <h4>{{item.title}}</h4>
                                <p>{{item.detail}}</p>
                            </el-card>
                        </el-timeline-item>
                    </el-timeline>
                </el-card>
                <!--热门专题-->
                <el-card>
                    <h2 style="font-weight: lighter">热门专题</h2>
                    <el-divider></el-divider>
                    <el-row gutter="10">
                        <el-col span="12" v-for="item in rightZtArr" style="margin: 15px 0">
                            <div class="hoverable">
                                <img :src="item.url" alt="" width="100%">
                                <p style="margin: 0">{{item.title}}</p>
                            </div>
                        </el-col>
                    </el-row>
                </el-card>
                <!--排行榜-->
                <el-card style="height: 500px;overflow-y: scroll">
                    <h2 style="font-weight: lighter">排行榜</h2>
                    <el-divider></el-divider>
                    <el-card class="hoverable" id="rightCRankDrawer" v-for="(item,i) in rightRankArr">
                        <h4 style="margin: 20px 0">{{i + 1}}-{{item.title}}</h4>
                        <el-row gutter="5">
                            <el-col span="10"><img :src="item.url" alt="null" width="100%" height="100%"></el-col>
                            <el-col span="14">
                                <p style="font-size: 10px;color: gray;
                                   display:-webkit-box;-webkit-line-clamp:2;
                                   -webkit-box-orient: vertical;overflow: hidden;
                                   margin: 0">{{item.detail}}</p>
                                <p style="font-size: 10px;color: gray">
                                    <i class="el-icon-view"></i> {{item.view}} | <i class="el-icon-star-off"></i>
                                    {{item.like}}</p>

                            </el-col>
                        </el-row>
                    </el-card>
                </el-card>
            </el-col>
        </el-row>
    </el-main>
    <el-footer id="el-ft" style="height: fit-content;width: 100%;">
        <!--footer开始-->
        <div id="ft-top-div" style="width: 100%;height: 220px;background:#2f3234;padding: 40px 0">
            <div style="width: 1200px;margin: 15px auto">
                <el-row type="flex" justify="space-between">
                    <el-col span="5" style="height: 100%">
                        <div style="margin: 0 auto">
                            <img src="../imgs/icon/icon01.png" alt="iconImg" style="filter: grayscale(100%)">
                            <p>教程灵感就看烘焙馆</p>
                            <p>烘焙行业网络社区平台</p>
                            <p>全国百城上千个职位等你来</p>
                        </div>
                    </el-col>
                    <el-col span="3" style="height: 100%">
                        <div class="verticalDivision"></div>
                    </el-col>
                    <el-col span="2" style="height: 100%">
                        <h3>关于我们</h3>
                        <a v-for="item in ftTopItems[0]"
                           class="hoverable" :href="item.url">
                            {{item.text}}
                        </a>
                    </el-col>
                    <el-col span="2" style="height: 100%">
                        <h3>支持与服务</h3>
                        <a v-for="item in ftTopItems[1]"
                           class="hoverable" :href="item.url">
                            {{item.text}}
                        </a>
                    </el-col>
                    <el-col span="2" style="height: 100%">
                        <h3>底部导航</h3>
                        <a v-for="item in ftTopItems[2]"
                           class="hoverable" :href="item.url">
                            {{item.text}}
                        </a>
                    </el-col>
                    <el-col span="3" style="height: 100%">
                        <div class="verticalDivision"></div>
                    </el-col>
                    <el-col span="5" style="height: 100%">
                        <el-row style="margin: 15px auto">
                            <el-col span="8" v-for="item in ftIconArr">
                                <el-popover
                                        placement="top"
                                        width="100%"
                                        trigger="hover">
                                    <el-row>
                                        <el-col span="12">
                                            <img :src="item.QRCard" alt="QRCard" height="120px">
                                        </el-col>
                                        <el-col span="12">
                                            <p>{{item.info1}}</p>
                                            <p :style="'color: '+item.color">{{item.info2}}</p>
                                        </el-col>
                                    </el-row>
                                    <el-button slot="reference" class="hoverable"
                                               style="background:none;border: none;padding:0">
                                        <img :src="item.url" alt="iconImg" height="35px"
                                             style="display: block;margin: 0 auto">
                                        <p style="text-align: center">{{item.text}}</p>
                                    </el-button>
                                </el-popover>

                            </el-col>
                        </el-row>
                        <div style="margin: 0 auto;width: fit-content">
                            <span style="font-size: 54px;color: rgb(255,115,0)">烘焙</span>
                            <span style="font-size: 54px;color: #676b6f;font-style: normal">馆</span>
                            <p>烘焙行业网络社区平台</p>
                        </div>
                    </el-col>
                </el-row>
            </div>
        </div>
        <div id="ft-mid-div" style="width: 100%;height: 23px;background:#2c2f31;padding: 13px 0">
            <div style="width: 1200px;margin: 0 auto">
                <span style="font-size: 16px;line-height: 30px;color: #676b6f;margin: 5px 0;">友情链接:</span>
                <a v-for="item in ftMidItems"
                   class="hoverable" :href="item.url" style="display: inline-block">
                    {{item.text}}
                </a>
            </div>
        </div>
        <div style="width: 100%;height: 23px;background:#292929;padding: 13px 0">
            <div style="width: 1200px;margin: 0 auto">
                <p style="color: #aaa;text-align: center;font-size: 14px;line-height: 30px;margin: 0 auto">
                    Copyright ©2018-2020 烘焙舘Powered by©Discuz!技术支持：烘焙馆 ( 赣ICP备19004781号-4 )
                </p>
            </div>
        </div>
        <!--footer结束-->
    </el-footer>
</div>
</body>

<!-- import Vue before Element -->
<script src="https://cdn.staticfile.org/vue/2.6.14/vue.min.js"></script>
<!-- import JavaScript -->
<script src="https://cdn.staticfile.org/element-ui/2.15.9/index.min.js"></script>

<script>
    function randInt(start, end) {
        if (end < start)
            throw Error
        let raw_rand = Math.random()
        let span = end - start
        return Math.round(start + raw_rand * span)
    }

    let v = new Vue({
        el: '#app',
        data: function () {
            return {
                hdTopNavActiveIndex: 4,
                hdTopMenuArr: [
                    {name: '首页', url: 'index.html'},
                    {name: '食谱', url: 'recipeList.html'},
                    {name: '视频', url: 'videoList.html'},
                    {name: '资讯', url: 'infoList.html'},
                    {name: '招聘', url: 'recruit.html'},
                ],
                search_text: '',
                bannerArr: [
                    {url: '../imgs/hd/首页header轮播图01.png', bgc: '#93d3dd'},
                    {url: '../imgs/hd/首页header轮播图02.png', bgc: '#afedf8'},
                    {url: '../imgs/hd/首页header轮播图03.png', bgc: '#670fed'},],
                topTopFastNavArr: [
                    {
                        text: '烘焙类',
                        nav: [{name: '烘焙师', info: '前端必学神器'},
                            {name: '烘焙中工', info: '烘焙中工'},
                            {name: '烘焙学徒', info: '热门html5教程'},
                            {name: '烘焙全能师', info: '零基础知识树'}],
                        job: ['面包师', '西点师', '烘焙主管', '产品研发', '面包主管', '常温蛋糕师']
                    },
                    {
                        text: '裱花类',
                        nav: [{name: '烘焙师', info: '前端必学神器'},
                            {name: '烘焙中工', info: '烘焙中工'},
                            {name: '烘焙学徒', info: '热门html5教程'},
                            {name: '烘焙全能师', info: '零基础知识树'}],
                        job: ['面包师', '西点师', '烘焙主管', '产品研发', '面包主管', '常温蛋糕师']
                    },
                    {
                        text: '艺术造型类',
                        nav: [{name: '全部教程', info: '前端必学神器'},
                            {name: '最新教程', info: '最新Drupal教程'},
                            {name: '热门推荐', info: '热门Drupal教程'},
                            {name: '新手入门', info: '零基础知识树'}],
                        job: ['AI插画', 'MG动画', '动态特效', '动态建模', 'logo设计', '虚拟写实']
                    },
                    {
                        text: '生产管理类',
                        nav: [{name: '全部教程', info: '前端必学神器'},
                            {name: '最新教程', info: '最新Drupal教程'},
                            {name: '热门推荐', info: '热门Drupal教程'},
                            {name: '新手入门', info: '零基础知识树'}],
                        job: ['AI插画', 'MG动画', '动态特效', '动态建模', 'logo设计', '虚拟写实']
                    },
                    {
                        text: '门店运营类',
                        nav: [{name: '全部教程', info: '前端必学神器'},
                            {name: '最新教程', info: '最新Drupal教程'},
                            {name: '热门推荐', info: '热门Drupal教程'},
                            {name: '新手入门', info: '零基础知识树'}],
                        job: ['AI插画', 'MG动画', '动态特效', '动态建模', 'logo设计', '虚拟写实']
                    },
                    {
                        text: '咖啡饮品类',
                        nav: [{name: '全部教程', info: '前端必学神器'},
                            {name: '最新教程', info: '最新Drupal教程'},
                            {name: '热门推荐', info: '热门Drupal教程'},
                            {name: '新手入门', info: '零基础知识树'}],
                        job: ['AI插画', 'MG动画', '动态特效', '动态建模', 'logo设计', '虚拟写实']
                    },
                    {
                        text: '区域销售类',
                        nav: [{name: '全部教程', info: '前端必学神器'},
                            {name: '最新教程', info: '最新Drupal教程'},
                            {name: '热门推荐', info: '热门Drupal教程'},
                            {name: '新手入门', info: '零基础知识树'}],
                        job: ['AI插画', 'MG动画', '动态特效', '动态建模', 'logo设计', '虚拟写实']
                    },],
                hdBottomMenuArr: [
                    {name: '分类信息', info: '免费快速发布行业信息',icon:'el-icon-s-flag'},
                    {name: '烘焙商圈', info: '专业烘焙行业商家推广平台',icon:'el-icon-help'},
                    {name: '求职招聘', info: '专属烘焙行业求职招聘平台',icon:'el-icon-s-custom'},
                    {name: '烘焙学院', info: '精选线上课程免费在线看',icon:'el-icon-discount'},
                ],
                leftItemsArr: [
                    {
                        url: '../imgs/mn/info/01.jpg',
                        title: '成都一蛋糕店遭恶意退单，一查竟是同行干的！对方回应：攻击错对象',
                        detail: '“订单下了之后，估摸着蛋糕快做完时就点退款，这种情况持续了一周。”在刚刚过去的一周，王先生位于成都市武侯区晋阳路的蛋糕店遇到了一件蹊跷的事儿，外卖平台上的订单在下单后不断被退单，共遇到四五十单，导',
                        author: '烘焙馆',
                        date: '2020-7-21 14:07',
                        view: randInt(1000, 5000),
                        reply: randInt(10, 100)
                    },
                    {
                        url: '../imgs/mn/info/02.jpg',
                        title: '烘焙行业越来越难做了？并不是！',
                        detail: '总有人抱怨说烘焙行业越来越难做了，其实主要还是经营策略和方法问题。我们拿生日蛋糕举例，尤其是水果蛋糕，有个十分大的难题，就是说制作次数太低。大部分人一年只过一次生日，每一家中历年消費不上几回。但针',
                        author: '烘焙馆',
                        date: '2020-7-21 14:02',
                        view: randInt(1000, 5000),
                        reply: randInt(10, 100)
                    },
                    {
                        url: '../imgs/mn/info/03.png',
                        title: '济南一知名品牌面包连锁店，多家门店关门，很多人充值卡还没消费',
                        detail: '近期，进驻济南多年的面包新语品牌连锁店已悄然关门，一时间让不少充值该店储值卡的消费者找不到消费门店，甚至面临退卡无门的窘境。18日，记者联系到面包新语品牌官方一工作人员。她表示，目前仅是暂时关掉多',
                        author: '烘焙馆',
                        date: '2020-7-21 13:53',
                        view: randInt(1000, 5000),
                        reply: randInt(10, 100)
                    },
                    {
                        url: '../imgs/mn/info/04.jpg',
                        title: '85度C又出事了，饮品里喝出“订书针”，店员的一波操作让女子直接曝',
                        detail: '据海峡消费报报道，福州一3岁小孩在85度C奶茶里喝出订书钉，卖家否认来源。近日，福州的郑女士在85度C门店里购买了一款名叫爆粒葡萄的饮品进行外带。在食用过程中，3岁的儿子从葡萄粒中吃出了一颗订书钉。幸运',
                        author: '烘焙馆',
                        date: '2020-7-17 17:23',
                        view: randInt(1000, 5000),
                        reply: randInt(10, 100)
                    },
                    {
                        url: '../imgs/mn/info/01.jpg',
                        title: '成都一蛋糕店遭恶意退单，一查竟是同行干的！对方回应：攻击错对象',
                        detail: '“订单下了之后，估摸着蛋糕快做完时就点退款，这种情况持续了一周。”在刚刚过去的一周，王先生位于成都市武侯区晋阳路的蛋糕店遇到了一件蹊跷的事儿，外卖平台上的订单在下单后不断被退单，共遇到四五十单，导',
                        author: '烘焙馆',
                        date: '2020-7-21 14:07',
                        view: randInt(1000, 5000),
                        reply: randInt(10, 100)
                    },
                    {
                        url: '../imgs/mn/info/02.jpg',
                        title: '烘焙行业越来越难做了？并不是！',
                        detail: '总有人抱怨说烘焙行业越来越难做了，其实主要还是经营策略和方法问题。我们拿生日蛋糕举例，尤其是水果蛋糕，有个十分大的难题，就是说制作次数太低。大部分人一年只过一次生日，每一家中历年消費不上几回。但针',
                        author: '烘焙馆',
                        date: '2020-7-21 14:02',
                        view: randInt(1000, 5000),
                        reply: randInt(10, 100)
                    },
                    {
                        url: '../imgs/mn/info/03.png',
                        title: '济南一知名品牌面包连锁店，多家门店关门，很多人充值卡还没消费',
                        detail: '近期，进驻济南多年的面包新语品牌连锁店已悄然关门，一时间让不少充值该店储值卡的消费者找不到消费门店，甚至面临退卡无门的窘境。18日，记者联系到面包新语品牌官方一工作人员。她表示，目前仅是暂时关掉多',
                        author: '烘焙馆',
                        date: '2020-7-21 13:53',
                        view: randInt(1000, 5000),
                        reply: randInt(10, 100)
                    },
                    {
                        url: '../imgs/mn/info/04.jpg',
                        title: '85度C又出事了，饮品里喝出“订书针”，店员的一波操作让女子直接曝',
                        detail: '据海峡消费报报道，福州一3岁小孩在85度C奶茶里喝出订书钉，卖家否认来源。近日，福州的郑女士在85度C门店里购买了一款名叫爆粒葡萄的饮品进行外带。在食用过程中，3岁的儿子从葡萄粒中吃出了一颗订书钉。幸运',
                        author: '烘焙馆',
                        date: '2020-7-17 17:23',
                        view: randInt(1000, 5000),
                        reply: randInt(10, 100)
                    }
                ],
                rightCaroArr: [
                    {
                        url: '../imgs/mn/info/01.jpg',
                        title: '成都一蛋糕店遭恶意退单，...'
                    },
                    {
                        url: '../imgs/mn/info/02.jpg',
                        title: '烘焙行业越来越难做了？并...'
                    },
                    {
                        url: '../imgs/mn/info/03.png',
                        title: '济南一知名品牌面包连锁店，...'
                    },
                    {
                        url: '../imgs/mn/info/04.jpg',
                        title: '85度C又出事了，饮品里喝出...'
                    }
                ],
                rightReplyArr: [
                    {
                        title: '入口即酥的超浓花生酱酥饼',
                        detail: '花生酱+花生油=超浓郁花生香没有糖粉，用了白砂糖本是入口即酥却又在酥后留下些许颗粒',
                        time: '2022/07/21'
                    },
                    {
                        title: '枣泥花式面包，好吃到爆',
                        detail: '之前做了枣泥馅，配上花式面包，好吃到爆。枣泥花式面包的用料肉松面包面团 见肉松面',
                        time: '2022/07/17'
                    },
                    {
                        title: '中种淡奶油吐司,送朋友超有面子',
                        detail: '前面做工烫种，波兰种，汤种面包，这次试试中种吐司吧，冷藏中种比常温的中种发的要小',
                        time: '2022/07/17'
                    },
                    {
                        title: '开放式三明治,一份小清新快手早餐',
                        detail: '昨夜下了很怕人的骤雨，清晨办公桌上的薄荷微微抖动它的叶子。一份小清新快手早餐，让',
                        time: '2022/07/17'
                    },
                    {
                        title: '酥脆培根吐司芝士卷，人见人爱',
                        detail: '人见人爱的培根平时一般都是放吐司里面做三文治吃今天培根要露脸啦哈哈哈哈简单快手酥',
                        time: '2022/07/17'
                    },
                    {
                        title: '烘焙行业越来越难做了？并不是！',
                        detail: '总有人抱怨说烘焙行业越来越难做了，其实主要还是经营策略和方法问题。我们拿生日蛋糕',
                        time: '2022/07/17'
                    },
                ],
                rightZtArr: [
                    {
                        url: '../imgs/mn/info/01.jpg',
                        title: '成都一蛋糕店遭恶意退单，...'
                    },
                    {
                        url: '../imgs/mn/info/02.jpg',
                        title: '烘焙行业越来越难做了？并...'
                    },
                    {
                        url: '../imgs/mn/info/03.png',
                        title: '济南一知名品牌面包连锁店，...'
                    },
                    {
                        url: '../imgs/mn/info/04.jpg',
                        title: '85度C又出事了，饮品里喝出...'
                    },
                    {
                        url: '../imgs/mn/recipe/01.jpg',
                        title: '枣泥花式面包，好吃到爆'
                    },
                    {
                        url: '../imgs/mn/recipe/02.jpg',
                        title: '中种淡奶油吐司,送朋友超...'
                    }
                ],
                rightRankArr: [
                    {
                        url: '../imgs/mn/recipe/01.jpg',
                        title: '入口即酥的超浓花生酱酥饼',
                        detail: '花生酱+花生油=超浓郁花生香没有糖粉，用了白砂糖本是入口即酥却又在酥后留下些许颗粒',
                        view: randInt(1000, 5000),
                        like: randInt(100, 500)
                    }, {
                        url: '../imgs/mn/recipe/02.jpg',
                        title: '成都一蛋糕店遭恶意退单，一查竟是同行干的',
                        detail: '“订单下了之后，估摸着蛋糕快做完时就点退款，这种情况持续了一周。”在刚刚',
                        view: randInt(1000, 5000),
                        like: randInt(100, 500)
                    }, {
                        url: '../imgs/mn/recipe/03.jpg',
                        title: '烘焙行业越来越难做了？并不是！',
                        detail: '总有人抱怨说烘焙行业越来越难做了，其实主要还是经',
                        view: randInt(1000, 5000),
                        like: randInt(100, 500)
                    }, {
                        url: '../imgs/mn/recipe/04.png',
                        title: '济南一知名品牌面包连锁店，多家门店',
                        detail: '近期，进驻济南多年的面包新语品牌连锁店已悄然关门，一时间让不少充值该店',
                        view: randInt(1000, 5000),
                        like: randInt(100, 500)
                    }, {
                        url: '../imgs/mn/recipe/05.jpg',
                        title: '枣泥花式面包，好吃到爆',
                        detail: '之前做了枣泥馅，配上花式面包，好吃到爆。枣泥花式',
                        view: randInt(1000, 5000),
                        like: randInt(100, 500)
                    }, {
                        url: '../imgs/mn/recipe/06.jpg',
                        title: '中种淡奶油吐司,送朋友超有面子',
                        detail: '中种淡奶油吐司,送朋友超有面子',
                        view: randInt(1000, 5000),
                        like: randInt(100, 500)
                    }, {
                        url: '../imgs/mn/recipe/07.jpg',
                        title: '入口即酥的超浓花生酱酥饼',
                        detail: '开放式三明治,一份小清新快手早餐',
                        view: randInt(1000, 5000),
                        like: randInt(100, 500)
                    }, {
                        url: '../imgs/mn/recipe/08.jpg',
                        title: '心形火龙果椰蓉面包,任谁都抗拒不了',
                        detail: '心形火龙果椰蓉面包,任谁都抗拒不了',
                        view: randInt(1000, 5000),
                        like: randInt(100, 500)
                    }, {
                        url: '../imgs/mn/recipe/09.jpg',
                        title: '酥脆培根吐司芝士卷，人见人爱',
                        detail: '人见人爱的培根平时一般都是放吐司里面做三文治吃今',
                        view: randInt(1000, 5000),
                        like: randInt(100, 500)
                    }, {
                        url: '../imgs/mn/recipe/10.jpg',
                        title: '红酒芝士面包,小小的梭子红酒芝士',
                        detail: '红酒揉进面团里？酵母会不会醉晕了呀？虽然满腹疑',
                        view: randInt(1000, 5000),
                        like: randInt(100, 500)
                    }
                ],
                ftTopItems: [
                    [
                        {text: '关于我们', url: ''},
                        {text: '烘焙学院', url: ''},
                        {text: '烘焙食谱', url: ''},
                        {text: '分类信息', url: ''},
                        {text: '求职招聘', url: ''},
                        {text: '社区交流', url: ''}],
                    [
                        {text: '联系我们', url: ''},
                        {text: '广告投放', url: ''},
                        {text: '用户协议', url: ''},
                        {text: '友情链接', url: ''},
                        {text: '在线反馈', url: ''},
                        {text: '我发投稿', url: ''}],
                    [
                        {text: 'Archiver', url: ''},
                        {text: '手机版', url: ''},
                        {text: '小黑屋', url: ''}]
                ],
                ftIconArr: [
                    {
                        url: '../imgs/ft/wx.png',
                        text: '官方微信',
                        QRCard: '../imgs/ft/qrwx.png',
                        info1: '每天官微五分钟一年萌新变大神',
                        info2: '扫码关注官方微信',
                        color: '#04c15f'
                    },
                    {
                        url: '../imgs/ft/wb.png',
                        text: '新浪微博',
                        QRCard: '../imgs/ft/qrwb.png',
                        info1: '每天50篇设计干货30万设计师关注！',
                        info2: '访问新浪微博',
                        color: '#ee231c'
                    },
                    {
                        url: '../imgs/ft/qq.png',
                        text: '官方客服',
                        QRCard: '../imgs/ft/qrwx.png',
                        info1: '专业客服24h在线解答问题',
                        info2: '扫码添加官方客服',
                        color: '#2f85f5'
                    },
                ],
                ftMidItems: [
                    {url: '', text: '申请友情链接'}, {url: '', text: '烘焙馆'}, {url: '', text: '烘焙食谱'},
                    {url: '', text: '烘焙网'}, {url: '', text: '可欣互动'}, {url: '', text: '特特美食网'},
                    {url: '', text: '成都地暖公司'}, {url: '', text: '汽车排行榜'}, {url: '', text: '展厅设计'},
                    {url: '', text: '灵芝孢子粉'}, {url: '', text: '重庆网'}, {url: '', text: '滋补养生'},
                    {url: '', text: '学术论文投稿'}, {url: '', text: '玻璃钢管道'}, {url: '', text: '精酿啤酒'}]
            }
        },
        methods: {
            hdNavHandleSelect(key, keyPath) {
                v.hdTopNavActiveIndex = key
            },
        }
    })
</script>
</html>